//异常处理组件
//这个组件的目的就是用于处理各种组件的异常 通过降级的ui让用户有更好的体验


import React from "react"

class Error extends React.Component {
    constructor() {
        super()
        this.state = {
            error: null
        }
    }
    //从错误的props中衍生出一个状态
    static getDerivedStateFromError(error) {//当组件出错的时候触发此钩子
        // console.log(error);
        return { //重新设置state的状态
            error
        }
    }

    componentDidCatch(err,errInfo) {//组件即将捕获错误
        //把错误信息提交给服务器
        console.log(err);
        console.log(errInfo);
    }
    render() {
        console.log(this.props);
        if (this.state.error) {//是否出错
            return <h1>错误:{this.state.error}</h1>
        }else {
            return (
                this.props.children
            )
        }
    }
}

export default Error